page.tsx

1import { notFound } from 'next/navigation'
2import { getContent, sortContentByDate } from '@/lib/content'
3import { generateMeta } from '@/lib/generateMeta'
4import { GuideLayout } from '@/components/guide-layout'
5import markdownStyles from '@/app/styles/markdown.module.css'
6
7interface Props {
8	params: {
9		slug: string
10	}
11}
12
13export function generateMetadata({ params }: Props) {
14	const guides = getContent('guides')
15	const guide = guides.find((g) => g.slug === params.slug)
16
17	if (!guide) return generateMeta({ title: 'Guide Not Found', path: '/guides' })
18
19	return generateMeta({
20		title: guide.metadata.title,
21		description: guide.metadata.description,
22		path: `/guides/${params.slug}`,
23	})
24}
25
26export default function GuidePage({ params }: Props) {
27	const guides = sortContentByDate(getContent('guides'))
28	const currentGuide = guides.find((guide) => guide.slug === params.slug)
29
30	if (!currentGuide) return notFound()
31
32	return (
33		<GuideLayout guides={guides} currentGuide={currentGuide}>
34			<div
35				className={markdownStyles.markdown}
36				dangerouslySetInnerHTML={{ __html: currentGuide.content }}
37			/>
38		</GuideLayout>
39	)
40}
41